<template>
    <div class="header">
        <div class="logo">
            <img src="../assets/img/logo.png" alt="">
        </div>
        <div class="account">
            <span class="account_info">当前用户：{{account}}</span>
            <Button size="small" type="success" ghost>注销</Button>
        </div>
    </div>
</template>

<script>
    import {Button} from 'view-design';

  export default {
    name: "IndexHeader",
    data() {
      return {
        account: 'admin',
      }
    },
    components: {[Button.name]: Button},
  }
</script>

<style scoped lang="scss">
    .header {
        min-height: 50px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0 30px;
        .logo {
            img {
                width: 30px;
                height: 30px;
            }
        }

        .account {
            .account_info {
                margin: 0 20px;
            }
        }
    }
</style>
